$(function(){
    $('#keyword').on('keyup',function (){
        const keyword = $(this).val();
        if(keyword!==null&&keyword!==''&&keyword.length!==0){
            $.ajax({
                type   :'GET',
                url    :'http://localhost:8088/supplierSearchAjax?keyword='+keyword,
                success:function (list){
                    console.log(keyword);
                    let productListHTML = '';
                    for(let i=0; i<list.length; i++){
                        productListHTML+='<li class=\"productAutoItem\" data-suppid="';
                        productListHTML+=list[i].suppid;
                        productListHTML+='">';
                        productListHTML+=list[i].name;
                        productListHTML+='</li>';
                    }
                    $('#productAutoList').html(productListHTML);
                    $('#productAutoComplete').show();
                },
                error  :function (errorMsg){
                    console.log(errorMsg);
                }
            });
        }else{
            $('#productAutoComplete').hide();
        }

    });

    $(document).on('click','.productAutoItem',function (){
        const itemId = $(this).data('suppid');
        console.log(itemId);
        $('#productAutoComplete').hide();
        $('#keyword').val('');
        window.location.href='http://localhost:8088/searchSupplier?keyword='+itemId ;
    });

    var origin = document.getElementById("origin");//这个是第一个界面
    var obj = document.getElementById("addSupplier");//这个是第二个界面
    var objEdit = document.getElementById("updateSupplier");//这个是第三个界面

    var confirmButton = document.getElementsByName("newSupplier");//这个是确认按钮
    var EditButton = document.querySelectorAll('.supplierEditButton');//这个是编辑按钮的集合

    obj.style.display="none";
    objEdit.style.display="none";

    $('#newSupplier').on('click',function(){
        origin.style.display="none";//隐藏
        obj.style.display="";//显示
    });

    EditButton.forEach(function(element){
        //将每一个Edit进行绑定
        element.onclick=function(){
            console.log("Edit successfully");
            origin.style.display="none";//隐藏
            objEdit.style.display="";//显示
            var name1 = this.getAttribute("name");
            var suppid = document.getElementsByName("updatesuppid");
            if (suppid != null){
                console.log('取到');
                suppid.value="ni hao";
                suppid.value="hello";
            }else{
                console.log('未取到');
            }
            var name = document.getElementsByName("updatename");
            var status = document.getElementsByName("updatestatus");
            var addr1 = document.getElementsByName("updateaddr1");
            var addr2 = document.getElementsByName("updateaddr2");
            var city = document.getElementsByName("updatecity");
            var state = document.getElementsByName("updatestate");
            var zip = document.getElementsByName("updatezip");
            var phone = document.getElementsByName("updatephone");
            //接下来要写ajax了
            $.ajax({
                type     :'GET',
                url      :'http://localhost:8088/supplierEditAjax?suppid='+name1,
                success  :function (data){
                    console.log(data.suppid);
                    //取到键值对了
                    suppid[0].value = data.suppid;
                    name[0].value = data.name;
                    status[0].value = data.status;
                    addr1[0].value = data.addr1;
                    console.log("addr1 is"+data.addr1);
                    console.log("addr2 is"+data.addr2);
                    console.log("addrcity is"+data.city);
                    addr2[0].value = data.addr2;
                    city[0].value = data.city;
                    state[0].value = data.state;
                    zip[0].value = data.zip;
                    phone[0].value = data.phone;
                },
                error    :function (errorMsg){
                    console.log(errorMsg);
                }
            });
        }
    });

});